<template>
    <el-row class="tac">
        <el-col :span="24">
            <el-menu default-active="2" :router="true" class="el-menu-vertical-demo" @open="handleOpen" @close="handleClose" background-color="#545c64" text-color="#fff" active-text-color="#3490de">
                <el-menu-item index='/statistics'>
                    <i class="el-icon-pie-chart"></i>
                    <span slot="title">统计</span>
                </el-menu-item>

                <el-submenu index="2">
                    <template slot="title">
                        <i class="el-icon-box"></i>
                        <span>车辆管理</span>
                    </template>
                    <el-menu-item-group>
                        <el-menu-item index="/car">车辆列表</el-menu-item>
                    </el-menu-item-group>
                </el-submenu>
                <el-submenu index="3">
                    <template slot="title">
                        <i class="el-icon-shopping-cart-full"></i>
                        <span>订单管理</span>
                    </template>
                    <el-menu-item-group>
                        <el-menu-item index="/order">全部订单</el-menu-item>
                    </el-menu-item-group>
                </el-submenu>
                <el-submenu index="4">
                    <template slot="title">
                        <i class="el-icon-user"></i>
                        <span>管理员管理</span>
                    </template>
                    <el-menu-item-group>
                        <el-menu-item>
                            <router-link to="/admin" tag="span">管理员列表</router-link>
                        </el-menu-item>
                        <el-menu-item></el-menu-item>
                    </el-menu-item-group>
                </el-submenu>
                <el-submenu index="6">
                    <template slot="title">
                        <i class="el-icon-s-ticket"></i>
                        <span>用户管理</span>
                    </template>
                    <el-menu-item-group>
                        <el-menu-item>
                            <router-link to="/user" tag="span">认证管理</router-link>
                        </el-menu-item>
                        <el-menu-item>
                            <router-link to="/userCheck" tag="span">审核管理</router-link>
                        </el-menu-item>
                    </el-menu-item-group>
                </el-submenu>
                <el-submenu index="7">
                    <template slot="title">
                        <i class="el-icon-video-camera"></i>
                        <span>评价管理</span>
                    </template>
                    <el-menu-item-group>
                        <el-menu-item>
                            <router-link to="/comments" tag="span">评价</router-link>
                        </el-menu-item>
                        <el-menu-item></el-menu-item>
                    </el-menu-item-group>
                </el-submenu>
                <el-submenu index="5">
                    <template slot="title">
                        <i class="el-icon-setting"></i>
                        <span>网站设置</span>
                    </template>
                    <el-menu-item-group>
                        <el-menu-item></el-menu-item>
                    </el-menu-item-group>
                </el-submenu>
            </el-menu>
        </el-col>
    </el-row>
</template>

<script>
export default {
    methods: {
        handleOpen(key, keyPath) {
            console.log(key, keyPath);
        },
        handleClose(key, keyPath) {
            console.log(key, keyPath);
        },
    },
};
</script>

<style>
.tac {
    overflow: hidden;
}
.tac,
.el-col,
.el-menu-vertical-demo {
    height: 100vh;
}
</style>
